<template>
	<view>
		<view class="bar">
			<view class="segmented">
				<uni-segmented-control disabled="false" :current="current" :values="items" @clickItem="onClickItem" style-type="button" active-color="#27a7e1">
				</uni-segmented-control>
			</view>
		</view>

		<view class="content">
			<view class="title">可删除不感兴趣的商家（长按删除）</view>
			<view v-show="current === 0">

				<view class="storeDetail" v-for="item in list" @longtap="trackDel">
					<view class="image">
						<image class="storeImage" mode="aspectFill" src="http://p0.meituan.net/waimaipoi/eec7c57c9497d61b02a886f0b8229ec3239616.jpg"></image>
					</view>
					<view class="desc">
						
						<view class="detailTitle">{{item}}</view>
						
						<view class="grade">
							<span>
								<uni-rate size="15" disabled="disabled" value="2.6"></uni-rate>
							</span>
							<span>4.9</span>
							<span>月售155单</span>
						</view>
						
						<view class="cost">
							<span>￥0起送&nbsp;|&nbsp;配送费￥5</span>
							<span class="right">336m | 17分钟</span>
						</view>
						
						<view class="isHaveBuy">
							购买过的店
						</view>
						
						<view class="subtract">
							<span><span class="circle">减</span>满35减12(不与美食活动同享)</span>
							<span class="right">3个活动&nbsp; <image mode="aspectFit" src="../../static/icon/xia_sanjiao.png"></image></span>
						</view>
						
						<view class="discount">
							<span><span class="circle">折</span>特惠5折抢</span>
						</view>
						
					</view>

				</view>
		</view>
		

			<view v-show="current === 1">
				<view>
					<view class="collectionDetail" v-for="item in cList" @longtap="collectionDel">
						<view class="image">
							<image class="storeImage" mode="aspectFill" src="http://p0.meituan.net/waimaipoi/eec7c57c9497d61b02a886f0b8229ec3239616.jpg"></image>
						</view>
						<view class="desc"  >
							<view class="detailTitle">{{item}}</view>
							<view class="list" >
								<span class="list-rate">
									<uni-rate size="15" disabled="disabled" value="2.6"></uni-rate>
								</span>
								<span>4.7</span>
								<span>月售520单</span>
							</view>
							<view class="far">
								656m | 31分钟
							</view>
						</view>
					</view>
				</view>
			</view>
			
			
		</view>
	</view>
</template>

<script>
	
	
	import uniIcon from "@dcloudio/uni-ui/lib/uni-icon/uni-icon.vue";
	import uniNavBar from "@dcloudio/uni-ui/lib/uni-nav-bar/uni-nav-bar.vue";
	import uniSegmentedControl from "@dcloudio/uni-ui/lib/uni-segmented-control/uni-segmented-control.vue";
	//星星评分
	import uniRate from "@dcloudio/uni-ui/lib/uni-rate/uni-rate.vue";
	
	var list = ['肯德基','李十八面皮','杨国福麻辣烫','张亮麻辣烫','孙悟空烤肉'];
	var cList = ['肯德基(静安市场店)','李十八面皮(闵行区)'];
	//,'杨国福麻辣烫(海南岛)','张亮麻辣烫(日本)','孙悟空烤肉(美国)'
	
	export default {
		data() {
			return {
				list : list,
				cList : cList,
				items: ['足迹', '收藏'],
				current: 0
			};
		},
		onLoad() {
			console.log('create')
		},
		onReady() {
			console.log('mounted')
		},
		onPullDownRefresh() {
			console.log('下拉刷新');
			setTimeout(function() {
				uni.stopPullDownRefresh();
				console.log('关闭刷新');
			}, 1000);

		},
		onReachBottom() {
			console.log('上拉触底')
		},
		methods: {
			onClickItem(index) {
				if (this.current !== index) {
					this.current = index;
				}
			},
			trackDel(){
				uni.showModal({
					title: '删除足迹',
					content: '确定删除该足迹的商家',
					success: function (res) {
						if (res.confirm) {
							console.log('用户点击确定');
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			},
			collectionDel(){
				uni.showModal({
					title: '删除收藏',
					content: '确定删除该收藏的商家',
					success: function (res) {
						if (res.confirm) {
							console.log('用户点击确定');
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			}
		},
		components: {
			uniNavBar,
			uniSegmentedControl,
			uniSegmentedControl,
			uniRate 
		}
	}
</script>

<style lang="less">
@import url("my-collect.less");
</style>
